<template>
  <div class="app-container">
    <el-card>
      <!-- 头部搜素start -->
      <el-form :model="query" ref="queryForm" :inline="true">
        <el-form-item label="任务名称">
          <common-input v-model="query.jobDesc" placeholder="请输入" clearable />
        </el-form-item>

        <el-form-item label="任务所属服务">
          <el-select v-model="query.jobGroup" placeholder="请选择" clearable >
            <el-option v-for="executor in  executorList" :label="executor.label" :value="executor.value"></el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="任务状态">
          <el-select v-model="query.triggerStatus" placeholder="请选择" clearable >
            <el-option label="全部" :value="-1"></el-option>
            <el-option label="启用" :value="1"></el-option>
            <el-option label="停用" :value="0"></el-option>
          </el-select>
        </el-form-item>

        <el-form-item>
          <el-button type="primary" icon="el-icon-search" @click="handleQuery">查询</el-button>
          <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
        </el-form-item>
      </el-form>
      <!-- 头部搜素end -->

      <!-- 按钮组织start -->
      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button type="primary" plain icon="el-icon-plus" @click="edit(null)" hasPermi>新增</el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button type="danger" plain icon="el-icon-delete" :disabled="multiple" @click="del(selectionIds)" hasPermi>批量删除
          </el-button>
        </el-col>
      </el-row>
      <!-- 按钮组织end -->

      <!--列表 start-->
      <common-table v-loading="loading" :data="list" @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="55" align="center"/>

        <el-table-column label="任务名称" align="left" prop="jobDesc">
          <template slot-scope="{row}">{{ row.jobDesc }}</template>
        </el-table-column>

        <el-table-column label="方法名称" align="left" prop="executorHandler">
          <template slot-scope="{row}">{{ row.executorHandler }}</template>
        </el-table-column>

        <el-table-column label="方法参数" align="left" prop="executorParam">
          <template slot-scope="{row}">{{ row.executorParam?row.executorParam:'-' }}</template>
        </el-table-column>

        <el-table-column label="运行周期" align="left" prop="scheduleConf">
          <template slot-scope="{row}">{{ row.scheduleConf }}</template>
        </el-table-column>

        <el-table-column label="创建人" align="left" prop="author">
          <template slot-scope="{row}">{{ row.author }}</template>
        </el-table-column>

        <el-table-column label="更新时间" align="left" prop="updateTime" >
          <template slot-scope="{row}">
            {{ row.updateTime ? utils.resolvingDate(row.updateTime) : '-'}}
          </template>
        </el-table-column>

        <el-table-column label="连接状态" align="center" prop="triggerStatus">
          <template slot-scope="{row}">
            <el-tag type="success" v-if="row.triggerStatus == 1">启用</el-tag>
            <el-tag type="danger" v-else>停用</el-tag>
          </template>
        </el-table-column>

        <el-table-column label="操作" align="left" width="160">
          <template slot-scope="{row}">
            <el-button type="text" @click="edit(row)" hasPermi>编辑</el-button>
            <el-button type="text" @click="task_handle(row.triggerStatus,row.id)" hasPermi>{{row.triggerStatus ==
              1?'停用':'启用'}}
            </el-button>
            <el-button type="text" @click="del([row.id])" hasPermi>删除</el-button>
          </template>
        </el-table-column>
      </common-table>

      <pagination :total="total" :page.sync="query.pageNum" :limit.sync="query.pageSize" @pagination="getList"/>
    </el-card>
    <!-- 列表 end -->
    <editDialog ref="editDialog" :executorList="executorList" @refresh="getList"/>
  </div>
</template>

<script>
  import editDialog from './components/editDialog';
  import {
    task_list,
    task_start,
    task_stop,
    task_remove,
  } from '@/api/taskcenter/all';
  import {executor_list} from '@/api/taskcenter/all';

  export default {
    components: {editDialog},
    props: {},
    data() {
      return {
        total: 1, // 总条数
        loading: false, // table 加载中
        list: [], // 数据列
        selectionIds: '', // 列表选中数据id
        single: true, // 非单个禁用
        multiple: true, // 非多个禁用
        query: {
          pageNum: 1,
          pageSize: 10,
          jobDesc: null,
          jobGroup: null,
          triggerStatus: null
        }, // 查询条件

        executorList: [],// 服务列表
      };
    },
    watch: {},
    computed: {},
    methods: {
      /**
       * 选择
       */
      handleSelectionChange(selection) {
        this.selectionIds = selection.map((item) => item.id);
        this.single = selection.length != 1;
        this.multiple = !selection.length;
        // console.log(this.selectionIds);
      },
      /**
       * 获取列表
       */
      getList() {
        let query = {...this.query};
        this.loading = true;
        if (query.triggerStatus == -1) {
          delete query.triggerStatus;
        }
        task_list(query).then((res) => {
          this.list = res.rows;
          this.total = res.total;
          this.loading = false;
        });
      },
      /**
       * 查询
       */
      handleQuery() {
        this.query.pageNum = 1;
        this.getList();
      },
      /**
       * 重置查询
       */
      resetQuery() {
        this.query = this.$options.data().query;
      },
      /**
       * 添加/编辑
       */
      edit(row) {
        this.$refs.editDialog.show(row ? {...row} : {});
      },
      /**
       * 删除
       */
      del(ids) {
        this.$GlobalDeleteConfirm()
          .then(() => {
            task_remove({ids: ids.join(',')}).then((res) => {
              this.getList();
              this.$GlobalSuccessMessage('删除成功');
            });
          }).catch(()=>{});
      },
      /**
       * 启用、停用
       */
      task_handle(status, id) {
        if (status == 0) {
          task_start({id: id}).then((res) => {
            this.getList();
          });
        }
        if (status == 1) {
          task_stop({id: id}).then((res) => {
            this.getList();
          });
        }
      },
      getExecutorList() {
        executor_list({
          pageNum: 1,
          pageSize: 999,
        }).then(res => {
          this.executorList = res.rows.reduce((r, c) => {
            r.push({
              label: c.title,
              value: c.id
            })
            return r;
          }, [])
        })
      }
    },
    created() {
      this.getList();
      this.getExecutorList();
    },
    mounted() {
    },
  };
</script>
<style lang="scss" scoped>
</style>
